<template>
  <base-breadcrumb>
    <title-name :title="processName+'-'+taskName" />
    <a-card
      :body-style="{ padding: '24px 32px' }"
      :bordered="false"
    >
      <title-name title="节点信息" />
      <a-descriptions title="">
        <a-descriptions-item label="当前节点">
          {{ taskName }}
        </a-descriptions-item>
        <a-descriptions-item label="审批人">
          {{ currentUser.name }}
        </a-descriptions-item>
        <a-descriptions-item label="审批时间">
          {{ currentTime }}
        </a-descriptions-item>
      </a-descriptions>

      <title-name title="审批意见" />
      <a-form
        ref="form1"
        :form="form"
        layout="vertical"
      >
        <a-row :gutter="24">
          <a-col
            :md="24"
            :sm="24"
          >
            <a-form-item>
              <BaseInput
                v-model="opinions"
                style="width:100%"
                placeholder="请填写审批意见"
                type="textarea"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <Consultation
          :proc-inst-id="procInstId"
          :is-show-btn="$route.query.isMonitoring ? ($route.query.monitoringType==='process' ? true: false): true"
          :task-name="taskName"
          :sub-approver-list.sync="subApproverList"
        >
          <template slot="approverButton">
            <a-button
              type="primary"
              style="margin-right: 20px;"
              @click="handelUnApproval"
            >
              审批不通过
            </a-button>
            <a-button
              type="primary"
              @click="handelApproval"
            >
              审批通过
            </a-button>
          </template>
        </Consultation>
      </a-form>

      <title-name title="审批流程信息" />
      <div class="btns-wrapp mb20">
        <a-button
          type="primary"
          @click="visibleState.auditProcess = true"
        > 审批流程图 </a-button>
      </div>
      <a-spin
        tip="流程信息加载中..."
        :spinning="flowRequesting"
      >
        <a-table
          :columns="columnApprove"
          :data-source="approveInfos"
          bordered
        >
          <span
            slot="serial"
            slot-scope="text, record, index"
          >{{ index + 1 }}</span>
        </a-table>
      </a-spin>
    </a-card>

    <a-form>
      <a-spin
        :spinning="spinning"
        tip="项目信息加载中..."
      >
        <a-card
          :body-style="{ padding: '24px 32px' }"
          :bordered="false"
        >
          <title-name title="项目、岗位设置、立项附件信息" />
          <a-tabs
            ref="tabs"
            v-model="nextSteps"
            @change="callback"
          >
            <a-tab-pane
              :key="1"
              tab="项目信息"
            >
              <a-row :gutter="24">
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="工程承包模式"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.contractModelName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="承包类型"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.innerPackageName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  v-if="isContract"
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="专业承包公司"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.contractBranchName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>

                <template v-if="isGeneral">
                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-model-item
                      label="总承包项目是否内部项目"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                      prop="epcIsInnerProject"
                    >
                      <BaseInput
                        :value="dels.epcIsInnerProject?'是':'否'"
                        type="text"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-item
                      label="总承包单位"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                    >
                      <BaseInput
                        v-model="dels.generalContractorCompanyName"
                        type="text"
                        disabled
                      />
                    </a-form-item>
                  </a-col>
                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-model-item
                      label="分包合同额（万）"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                      prop="subContractAmount"
                    >
                      <BaseInput
                        v-model="dels.subContractAmount"
                        type="text"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    :md="24"
                    :sm="24"
                  >
                    <a-form-model-item
                      label="备注"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                      prop="remark"
                    >
                      <BaseTextarea
                        v-model="dels.remark"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                </template>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目备案名称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目简称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectOmit"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目编号"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectNum"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="中标时间"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.winningTime"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="一级地域"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.oneAreaName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="二级地域"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.secondAreaName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="三级地域"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.threeAreaName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="四级地域"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.fourAreaName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="地理坐标"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInputNumber
                      v-model="dels.longitude"
                      type="text"
                      style="margin-right: 20px; width: 100px !important; float: left"
                      disabled
                    />
                    <BaseInputNumber
                      v-model="dels.latitude"
                      type="text"
                      style="width: 100px !important; float: left"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="24"
                  :sm="24"
                >
                  <a-form-item
                    label="详细地址"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseTextarea
                      v-model="dels.projectAddress"
                      :title="dels.projectAddress"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="区域一级管辖单位(所属办事处)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.jurisdictionOneName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="区域二级管辖单位(所属办事处)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.jurisdictionTwoName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="签约单位"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.contractUnit"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="承接名义"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.undertakeName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="实施单位(所属二级单位)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.implementationTwoName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="实施单位(所属三级单位)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.implementationThreeName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目类型"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectTypeName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目业态"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectFormatName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="结构类型"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.structureTypeName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="24"
                  :sm="24"
                >
                  <a-form-model-item
                    label="风险条件"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                    prop="riskCondition"
                  >
                    <TreeSelect :value="dels.riskCondition" disabled placeholder="" />
                  </a-form-model-item>
                </a-col>                
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目重要程度"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectImportanceName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="是否为重点项目"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.keyProjectsName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="工程类型"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.engineeringTypeName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="工程性质"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectNatureName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="局级大客户"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.bureauCustomerName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="公司级大客户"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.companyCustomerName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="客户级别"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.customerLevelName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="设计单位名称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.designUnitName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="建设单位名称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.constructionName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="建设单位性质"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.constructionNatureName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="建设单位社会统一信用代码"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.constructionCode"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="审计单位名称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.auditName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="监理单位名称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.supervisionName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="勘察单位名称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.surveyName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="咨询单位名称"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.consultingName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="是否签订合同"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <a-radio-group
                      v-model="dels.contractCode"
                      disabled
                    >
                      <a-radio :value="1">
                        已签订
                      </a-radio>
                      <a-radio :value="0">
                        未签订
                      </a-radio>
                    </a-radio-group>
                  </a-form-item>
                </a-col>
                <a-col
                  v-if="isContractMileage"
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="合同工程里程(Km)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.contractMileage"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <template
                  v-if="isConstruction"
                  :gutter="24"
                >
                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-item
                      label="合同建筑面积-地上(万m2)"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                    >
                      <BaseInput
                        v-model="dels.contractAreaGround"
                        type="text"
                        disabled
                      />
                    </a-form-item>
                  </a-col>

                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-item
                      label="合同建筑面积-地下(万m2)"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                    >
                      <BaseInput
                        v-model="dels.contractAreaUnderground"
                        type="text"
                        disabled
                      />
                    </a-form-item>
                  </a-col>

                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-item
                      label="地上层数"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                    >
                      <BaseInput
                        v-model="dels.groundFloor"
                        type="text"
                        disabled
                      />
                    </a-form-item>
                  </a-col>
                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-item
                      label="地下层数"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                    >
                      <BaseInput
                        v-model="dels.undergroundFloor"
                        type="text"
                        disabled
                      />
                    </a-form-item>
                  </a-col>
                  <a-col
                    :md="8"
                    :sm="8"
                  >
                    <a-form-item
                      label="合同建筑总面积(万m2)"
                      :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                      :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                    >
                      <BaseInput
                        v-model="dels.contractTotalArea"
                        type="text"
                        disabled
                      />
                    </a-form-item>
                  </a-col>
                </template>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="合同单体工程个数"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.contractSingleProject"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    :label="engineeringMetersLabel"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.engineeringMeters"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <!--<a-col :md="8" :sm="8">-->
                <!--<a-form-item-->
                <!--label="维保期时间"-->
                <!--:labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"-->
                <!--:wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"-->
                <!--&gt;-->
                <!--<BaseInput v-model="dels.maintenanceTime" type="text" disabled></BaseInput>-->
                <!--</a-form-item>-->
                <!--</a-col>-->
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="合同开工日期"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <a-date-picker
                      v-model="dels.contractStartDate"
                      disabled
                      placeholder="请选择日期"
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="合同竣工日期"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <a-date-picker
                      v-model="dels.contractEndDate"
                      disabled
                      style=""
                      placeholder="请选择日期"
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="合同工期(天)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.contractDays"
                      disabled
                      placeholder="合同工期"
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="合同额(万)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.contractValue"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="自有施工合同额(万)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.ownerContractValue"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="专业工程暂估价总额(万)"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.estimateTotalAmount"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="备案项目经理"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.projectManagerName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="24"
                  :sm="24"
                >
                  <a-form-item
                    label="项目特点或难点"
                    :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                    :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }"
                  >
                    <BaseInput
                      v-model="dels.projectFeatures"
                      type="textarea"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="24"
                  :sm="24"
                >
                  <a-form-item
                    label="主施工范围"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.mainScope"
                      type="textarea"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="计划创优级别"
                    :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                    :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }"
                  >
                    <BaseInput
                      v-model="dels.excellencePlanName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="计划创优内容"
                    :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                    :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }"
                  >
                    <BaseInput
                      v-model="dels.meritContentName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="计划观摩级别"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.observePlanName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="24"
                  :sm="24"
                >
                  <a-form-item
                    label="计划观摩内容"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.observeContent"
                      type="textarea"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目设计管理类别"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.designName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目科技管理类别"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.technologyName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>
                <a-col
                  :md="8"
                  :sm="8"
                >
                  <a-form-item
                    label="项目类别（质量）"
                    :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                  >
                    <BaseInput
                      v-model="dels.qualityName"
                      type="text"
                      disabled
                    />
                  </a-form-item>
                </a-col>

                <a-button
                  style="float: right; margin-top: 20px"
                  type="primary"
                  @click="nextStep()"
                >
                  下一页
                </a-button>
              </a-row>

              <div class="floatRight maginTop">
                <a-button
                  style="margin-right:20px"
                  type="primary"
                  @click="toStep(2)"
                >
                  查看项目部设置
                </a-button>
                <a-button
                  type="primary"
                  @click="toStep(3)"
                >
                  查看立项附件
                </a-button>
              </div>
            </a-tab-pane>

            <a-tab-pane
              :key="2"
              tab="项目部设置"
            >
              <title-name title="项目领导班子人员配置" />
              <a-table
                :columns="columns"
                :data-source="projectPost"
                bordered
              >
                <span
                  slot="serial"
                  slot-scope="text, record, index"
                >{{ index + 1 }}</span>
                <span
                  slot="employeeName"
                  slot-scope="record"
                >
                  <template>
                    {{ record.staffList.map(s=>s.staffName).join(',') }}
                  </template>
                </span>
                <span
                  slot="employeeNum"
                  slot-scope="record"
                >
                  <template>
                    <span
                      v-for="(staff,index) in record.staffList"
                      :key="staff"
                    >
                      <span v-if="index !=0 ">,</span>
                      <span
                        v-if="staff.statusCode == 0 "
                        style="color:rgba(0, 0, 0, 0.65)"
                      >{{ staff.staffCode }}</span>
                      <span
                        v-else-if="staff.statusCode != 0 "
                        style="color:red;"
                      >{{ staff.staffCode }}</span>
                    </span>
                  </template>
                </span>
                <span
                  slot="status"
                  slot-scope="record"
                >
                  <template>
                    {{ record.staffList.map(s=>s.statusName).join(',') }}
                  </template>
                </span>
              </a-table>
              <title-name
                title="其他岗位人员配置"
                class="maginTop"
              />

              <a-table
                :columns="columns"
                :data-source="otherPost"
                bordered
              >
                <span
                  slot="serial"
                  slot-scope="text, record, index"
                >{{ index + 1 }}</span>
                <span
                  slot="employeeName"
                  slot-scope="record"
                >
                  <template>
                    {{ record.staffList.map(s=>s.staffName).join(',') }}
                  </template>
                </span>
                <span
                  slot="employeeNum"
                  slot-scope="record"
                >
                  <template>
                    <span
                      v-for="(staff,index) in record.staffList"
                      :key="staff"
                    >
                      <span v-if="index !=0 ">,</span>
                      <span
                        v-if="staff.statusCode == 0 "
                        style="color:rgba(0, 0, 0, 0.65)"
                      >{{ staff.staffCode }}</span>
                      <span
                        v-else-if="staff.statusCode != 0 "
                        style="color:red;"
                      >{{ staff.staffCode }}</span>
                    </span>
                  </template>
                </span>
                <span
                  slot="status"
                  slot-scope="record"
                >
                  <template>
                    {{ record.staffList.map(s=>s.statusName).join(',') }}
                  </template>
                </span>
              </a-table>
              <div class="floatRight maginTop">
                <a-button
                  style="margin-right:20px"
                  type="primary"
                  @click="toStep(1)"
                >
                  查看项目信息
                </a-button>
                <a-button
                  type="primary"
                  @click="toStep(3)"
                >
                  查看立项附件
                </a-button>
              </div>
            </a-tab-pane>

            <a-tab-pane
              :key="3"
              tab="附件"
            >
              <u-table
                :list-url="listUrl"
                :business-id="id"
                business-code="PM01"
              />
              <div class="floatRight maginTop">
                <a-button
                  style="margin-right:20px"
                  type="primary"
                  @click="()=>toStep(1)"
                >
                  查看项目信息
                </a-button>
                <a-button
                  type="primary"
                  @click="()=>toStep(2)"
                >
                  查看项目部设置
                </a-button>
              </div>
            </a-tab-pane>
          </a-tabs>
        </a-card>
      </a-spin>
    </a-form>
    <ApprovalDetails
      :title="'审批流程信息'"
      :business-id="id"
      :visible="visibleState.auditProcess"
      @cancel="visibleState.auditProcess = false"
      @confirm="visibleState.auditProcess = false"
    />
  </base-breadcrumb>
</template>

<script>
import ApprovalDetails from '@/components/approvalDetails'
import { postChangeLog } from '@/mixin/mixin'
// import FooterToolBar from '@/components/FooterToolbar'
import { getDesignType, getProjectsDel, getDepartConfig, getProjectTypes } from '@/api/project/projects'
import { getProcessNodeList, completeTask } from '@/api/process'
import { getOrgEmployeesListBy } from '@/api/commons'
import { notifyParentWindow } from '@/utils/util.js'
import moment from 'moment'
import Vue from 'vue'
import Consultation from './components/consultation'
import TreeSelect from '@/views/project/projects/addProjects/components/TreeSelect' // 【风险条件】专用

const columnApprove = [
  {
    title: '序号',
    width: 80,
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '审批人',
    dataIndex: 'userName'
  },
  {
    title: '审批时间',
    dataIndex: 'createTime'
  },
  {
    title: '节点名称',
    dataIndex: 'taskName'
  },
  {
    title: '滞留时间',
    dataIndex: 'durationInMillis'
  },
  {
    title: '审批意见',
    dataIndex: 'formData.opinions'
  }
]
const columns = [
  {
    title: '序号',
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '岗位名称',
    dataIndex: 'jobName',
    width: '15%'
  },
  {
    title: '岗位人员姓名',
    width: '40%',
    scopedSlots: { customRender: 'employeeName' }
  },
  {
    title: '员工编号',
    scopedSlots: { customRender: 'employeeNum' }
  },
  {
    title: '状态',
    scopedSlots: { customRender: 'status' }
  }
]
const columns1 = [
  {
    title: '序号',
    dataIndex: 'name',
    width: '10%',
    scopedSlots: { customRender: 'name' }
  },
  {
    title: '附件名称',
    dataIndex: 'annuxName',
    width: '15%',
    scopedSlots: { customRender: 'age' }
  },
  {
    title: '附件格式',
    dataIndex: 'annux',
    scopedSlots: { customRender: 'annux' }
  },
  {
    title: '附件地址',
    dataIndex: 'annuxAddress',
    width: '40%',
    scopedSlots: { customRender: 'annuxAddress' }
  },
  {
    title: '操作',
    dataIndex: 'operation',
    scopedSlots: { customRender: 'operation' }
  }
]

export default {
  name: 'StandardList',
  mixins: [postChangeLog],
  components: {
    // FooterToolBar,
    Consultation,
    ApprovalDetails,
    TreeSelect
  },
  props: {
    text: String
  },
  data() {
    return {
      // 审批流程信息
      visibleState: {
        auditProcess: false
      },
      spinning: false,
      forms: {},
      visibles: false,
      columnApprove,
      approveInfos: [], // 审批流程信息

      visible: false, // 人员配置调整
      confirmLoading: false,
      mdl: null, // 数据
      //附件列表查询
      listUrl: '/cscec-project-business/file/business/project-fileQuery',
      projectModecode: '', // 工程承包模式code
      projectModeId: '', // 工程承包模式
      isContract: false, // 专业承包分公司
      isGeneral: false, // 总承包公司

      editable: false,
      projectNum: '',
      opinions: '',
      nextSteps: 1,

      columns,
      columns1,
      editingKey: '',
      selectedRowKeys: [],

      value: 1, // 是否签订合同

      previewImage: '',

      data: [],

      queryParam: {
        projectName: '',
        name: ''
      },
      form: this.$form.createForm(this),
      status: 'all',
      areaCode: '',
      employeeNum: '', // 项目部设置人员调整编号
      isContractMileage: false, // 线性基础数据
      isConstruction: false, // 房建
      id: '', // 项目id
      branchCode: '', // 是否是分公司 科技管理中心
      dels: {},
      designTypes: [],
      qualityTypes: [], // 项目类别 质量

      projectPost: [], // 项目人员岗位设置
      otherPost: [], //  其他人员岗位设置

      procInstId: '', //当前流程实例ID
      taskId: '', //当前流程节点ID
      processName: '', //流程名称
      taskName: '', //当前流程节点名称
      taskDefKey: '', //任务标识
      currentTime: '', //当前审批时间
      currentUser: '', //当前审批人
      flowRequesting: false,
      // 最高(长)单位工程米数(Km)名字
      engineeringMetersLabel: '最高(长)单位工程米数(Km)',
      // 下级审批人
      subApproverList: []
    }
  },
  created() {
    this.id = this.$route.query.businessId
    if (!this.id) {
      this.$error({ content: '无指定项目，将自动关闭' })
      setTimeout(() => {
        window.close()
      }, 1500)
      return
    }
    this.procInstId = this.$route.query.procInstId
    this.taskName = decodeURIComponent(this.$route.query.name)
    this.processName = decodeURIComponent(this.$route.query.processName)
    this.taskId = this.$route.query.taskId
    this.taskDefKey = this.$route.query.taskDefKey
    this.currentTime = moment().format('YYYY-MM-DD HH:mm:ss')
    this.currentUser = Vue.getAcloudProvider().getUserInfo()
    document.title = this.processName + '-' + this.taskName
    this.getInstallationBranchId()
    this.getDesignType()
    this.getDepartConfig()
    this.getDepartConfigs()
    this.getProjectTypes()
    //获取流程节点执行情况
    this.getProcessNodes()
  },
  computed: {},
  methods: {
    getProcessNodes() {
      this.flowRequesting = true
      getProcessNodeList({ procInstId: this.procInstId, pageNo: 1, pageSize: 100 })
        .then((res) => {
          if (res.code === 200) {
            const data = res.data
            const userIds = data.map((d) => {
              if (d.formData) {
                d.formData = JSON.parse(d.formData)
              }
              return d.assignee
            })
            getOrgEmployeesListBy({ userIds }).then((employees) => {
              this.flowRequesting = false
              res.data.forEach((r) => {
                employees.data.some((e) => {
                  if (e.userId === r.assignee) {
                    r.userName = e.name
                    return true
                  }
                })
              })
              this.approveInfos = res.data
            })
          }
        })
        .catch(() => {
          this.flowRequesting = false
        })
    },
    /**
     * @description: 组装下级审批人数据
     * @param {array} subApproverList 下级审批人表格数据
     * @return {object} 下级审批人数据
     */
    createApproverList(subApproverList) {
      const subordinateApproverList = {}
      subApproverList.forEach((item) => {
        if (item?.approver && item.approver.length > 0) {
          subordinateApproverList[item.taskInfo.id] = {
            assgins: item.approver?.map((el) => el.key).join(','),
            assignTypeEnum: 2
          }
        }
      })
      return subordinateApproverList
    },
    /**
     * @description: 审批
     * @param {boolean} reject 是否不通过
     * @param {object} subordinateApproverList 下级审批人
     * @return {promise}
     */
    submit(reject, subordinateApproverList = {}) {
      const data = {
        formData: {
          opinions: this.opinions,
          reject
        },
        procInstId: this.procInstId,
        taskId: this.taskId,
        userId: this.currentUser.id,
        variables: {
          reject,
          ...subordinateApproverList
        }
      }
      return completeTask(data)
        .then((res) => {
          if (res.status === 200) {
            // this.$success({
            //   content: '审批提交成功，即将自动关闭当前窗口',
            //   onOk() {
                window.close()
            //   }
            // })
            // setTimeout(() => {
            //   window.close()
            // }, 2000)
          } else {
            this.$error({ content: '审批提交失败，请稍后重试' })
          }
          return res
        })
        .catch((err) => {
          return err
        })
    },
    handelUnApproval() {
      // 审批不通过
      const _this = this
      if (!_this.opinions) {
        _this.$warning({ content: '请填写审批意见' })
        return
      }
      const confirmWin = this.$confirm({
        title: '警告提醒！',
        content: '确定审批不通过？',
        okType: 'danger',
        onOk() {
          return new Promise((resolve, reject) => {
            _this
              .submit(true)
              .then(() => {
                resolve()
                confirmWin.destroy()
              })
              .catch(() => reject)
          }).catch(() => this.$error({ content: '审批提交失败，请稍后重试' }))
        },
        onCancel() {}
      })
    },

    handelApproval() {
      // 审批通过
      const _this = this
      const confirmWin = this.$confirm({
        title: '警告提醒！',
        content: '确定审批通过？',
        okType: 'danger',
        onOk() {
          return new Promise((resolve, reject) => {
            _this
              .submit(false, _this.createApproverList(_this.subApproverList))
              .then(() => {
                _this.handleGetPostsChangeLog() //获取一周内岗位变更数量
                notifyParentWindow() // 通知父窗口
                resolve()
                confirmWin.destroy()
              })
              .catch(() => reject)
          }).catch((err) => {
            console.log(err)
            this.$error({ content: '审批提交失败，请稍后重试' })
          })
        },
        onCancel() {}
      })
    },

    employeeNums(val) {
      this.employeeNum = val
    },
    getProjectTypes() {
      getProjectTypes().then((res) => {
        this.qualityTypes = res.data
      })
    },

    getDesignType() {
      getDesignType().then((res) => {
        this.designTypes = res.data
      })
    },
    getInstallationBranchId() {
      let id = this.id
      this.spinning = true
      getProjectsDel({ projectId: id })
        .then((res) => {
          this.dels = res.data
          this.dels.riskCondition = res.data.riskCondition ? res.data.riskCondition.split(",") : []
          if (this.dels.contractModelCode == 'zycb' && this.dels.innerPackageCode == 0) {
            this.isGeneral = true // 总承包
            this.isContract = false // 专业承包
          }
          if (this.dels.contractModelCode == 'zycb' && this.dels.innerPackageCode == 1) {
            this.isGeneral = false // 总承包
            this.isContract = true // 专业承包
          }
          if (this.dels.contractModelCode != 'zycb' && this.dels.innerPackageCode == 1) {
            this.isGeneral = false // 总承包
            this.isContract = true // 专业承包
          }
          if (this.dels.contractModelCode != 'zycb' && this.dels.innerPackageCode == 0) {
            this.isGeneral = false // 总承包
            this.isContract = false // 专业承包
          }

          if (this.dels.calculateTypeCode == '0') {
            this.isContractMileage = false
            this.isConstruction = true
          } else {
            this.isContractMileage = true
            this.isConstruction = false
          }
          this.dels.innerPackageName = res.data.innerPackageCode === 0 ? '自主承包' : '内部承包'
          // 项目类型为其他改变最高(长)单位工程米数字段名字
          if (this.dels.projectTypeCode === '638571526815358976') {
            // 其他
            this.engineeringMetersLabel = '最高(长)单位工程米数(km)'
          } else if (this.dels.projectTypeCode === '638571485077839872') {
            // 线性基础设施
            this.engineeringMetersLabel = '最长单位工程里程(km)'
          } else if (this.dels.projectTypeCode === '638571399132356608') {
            // 房建
            this.engineeringMetersLabel = '最高单位工程米数(米)'
          } else {
            this.engineeringMetersLabel = '最高(长)单位工程米数(km)'
          }
          this.spinning = false
        })
        .catch(() => {
          this.spinning = false
        })
    },
    getDepartConfig() {
      // 项目岗位设置
      let proId = this.id
      getDepartConfig({ projectId: proId, projectJobType: 1 }).then((res) => {
        this.projectPost = res.data.postConfigList
      })
    },
    getDepartConfigs() {
      // 其他岗位设置
      let proId = this.id
      getDepartConfig({ projectId: proId, projectJobType: 0 }).then((res) => {
        this.otherPost = res.data.postConfigList
      })
    },
    nextStep() {
      if(this.nextSteps == 3) {
        return
      }
      this.nextSteps++
    },
    callback(key) {
      // tabs切换
      this.nextSteps = key
    },
    toStep(step) {
      if (step !== 1 && step !== 2 && step !== 3) {
        return
      }
      this.nextSteps = step
    }
  }
}
</script>



